<!--
 * @Descripttion: 
 * @version: 
 * @Author: wjh
 * @Date: 2022-02-23 18:34:16
 * @LastEditors: wjh
 * @LastEditTime: 2022-03-15 22:35:54
-->
<template>
  <el-dialog  
    :visible.sync="visibleDialog" 
    v-bind="$attrs" 
    v-on="$listeners">

    <slot></slot>

    <template #footer>

      <slot name="footer" v-if="$scopedSlots.footer"><!--可以通过 this.$scopedSlots 访问作用域插槽，每个作用域插槽都是一个返回若干 VNode 的函数-->
        
      </slot>
      <EBtn @click="$emit('confirm')" v-else>确定</EBtn> <!--可以用mode="confirm"-->
    </template>

  </el-dialog>

</template>
<script>
export default {
  inheritAttrs: false,
  props: {
    visible: {
      type: Boolean,
      require:true
    }
  },
  computed: {
    visibleDialog: {
      get() {
        return this.visible;
      },
      set() {
        this.$emit("update:visible");
      }
    }
  },
  methods: {
    handleConfirm() {
      this.$emit("confirm");
    }
  }
};
</script>
<style lang="scss">

</style>